<!--
	This file is part of ELCube.
	ELCube is free software: you can redistribute it and/or modify
	it under the terms of the GNU Affero General Public License as published by
	the Free Software Foundation, either version 3 of the License, or
	(at your option) any later version.
	ELCube is distributed in the hope that it will be useful,
	but WITHOUT ANY WARRANTY; without even the implied warranty of
	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
	GNU Affero General Public License for more details.
	You should have received a copy of the GNU Affero General Public License
	along with ELCube.  If not, see <https://www.gnu.org/licenses/>.
-->
<template>
    <nk-card>
        <a-button @click="nk$calc">calc</a-button>

        <vxe-table
                ref="xTable"
                auto-resize
                resizable
                highlight-hover-row
                size="mini"
                border=inner
                :data="list">
            <vxe-column field="date"                width="15%" title="应记日期" formatter="nkDatetime"></vxe-column>
            <vxe-column field="type"                width="14%" title="账单类别"></vxe-column>
            <vxe-column field="amount"              width="20%" align="right" title="账单金额" formatter="nkCurrency"></vxe-column>
            <vxe-column field="accountingAmount"    width="20%" align="right" title="记账金额" formatter="nkCurrency"></vxe-column>
            <vxe-column type="expand">
                <template #content="{ row }">
                    <div style="padding:8px">
                        <vxe-table
                                ref="xTable"
                                auto-resize
                                resizable
                                highlight-hover-row
                                size="mini"
                                border=inner
                                :data="test">
                            <vxe-column field="subject"             width="12%" title="科目编码"></vxe-column>
                            <vxe-column field="subjectDesc"         width="15%" title="科目名称"></vxe-column>
                            <vxe-column field="side"                width="10%" title="方向"></vxe-column>
                            <vxe-column field="amount"              width="20%" align="right" title="金额" formatter="nkCurrency"></vxe-column>
                            <vxe-column field="date"                width="12%" title="记账日期" formatter="nkDatetime"></vxe-column>
                            <vxe-column field="summary"             width="20%" title="摘要"></vxe-column>
                            <vxe-column >
                                <template>
                                    <a>查看</a>
                                </template>
                            </vxe-column>
                        </vxe-table>
                    </div>
                </template>
            </vxe-column>
        </vxe-table>
        <vxe-pager
                size="mini"
                :current-page="page.page"
                :page-size="page.size"
                :total="data.length"
                :page-sizes="[20, 50,100]"
                :layouts="['PrevPage', 'JumpNumber', 'NextPage', 'Sizes', 'Total']"
                @page-change="handlePageChange">
        </vxe-pager>

    </nk-card>
</template>

<script>
    import Mixin from "Mixin";

    export default {
        mixins:[new Mixin({})],
        data(){
            return {
                page:{
                    page:1,
                    size:50
                },
                test:[{
                    subject:'113202',
                    subjectDesc:'应收利息\\税率13%',
                    side:'D借',
                    amount:131.94,
                    date:1649865600,
                    summary:'结转应收利息'
                },{
                    subject:'113302',
                    subjectDesc:'应计利息\\税率13%',
                    side:'C贷',
                    amount:131.94,
                    date:1649865600,
                    summary:'结转应收利息'
                },{
                    subject:'113202',
                    subjectDesc:'应计利息\\税率13%',
                    side:'D借',
                    amount:131.94,
                    date:1650384000,
                    summary:'计提租金收入'
                },{
                    subject:'60410106',
                    subjectDesc:'租赁收入\\一般业务收入\\税率13%',
                    side:'C贷',
                    amount:116.76,
                    date:1650384000,
                    summary:'计提租金收入'
                },{
                    subject:'22211103',
                    subjectDesc:'应交税费\\待转销项税额\\税率13%（租赁收入）',
                    side:'C贷',
                    amount:15.18,
                    date:1650384000,
                    summary:'计提租金收入'
                }]
            }
        },
        computed:{
            list(){
                return this.data.slice(
                    (this.page.page - 1) * this.page.size,
                    this.page.page       * this.page.size
                )
            }
        },
        methods:{
            handlePageChange(e){
                this.page.size = e.pageSize;
                this.page.page = e.currentPage;
            }
        }
    }
</script>

<style scoped>

</style>